<template>
	<view class='comments-pop'>
		<view>
			<titlebara mode="动态" :back="true" :text="text" backgroundColor='#ffffff'>
				<view style="position: fixed;width: 100vw;left: 0;" slot="title">
					<!-- #ifdef APP-PLUS||H5 -->
					<image class="showMore" mode='aspectFit' v-if="currentUserPhone == userInfo.phone"
						src="https://dnsverify.pfmoto.com/appstatic/community/more.png" @click="showMore" />
					<image class="showMore" mode='aspectFit' v-else
						src="https://dnsverify.pfmoto.com/appstatic/community/share.png" @click="shareAction" />
					<view class="titleText">{{text}}</view>
					<!-- #endif -->
					<!-- #ifdef MP-WEIXIN -->
					<image class="showMore" mode='aspectFit' v-if="currentUserPhone == userInfo.phone"
						src="https://dnsverify.pfmoto.com/appstatic/community/more.png" @click="showMore" />
					<view class="titleText">{{text}}</view>
					<!-- #endif -->
				</view>
			</titlebara>

		</view>

		<z-paging ref="paging" @refresherTouchend="refresherTouchend" v-model="answerList" @query="loadnewAnswerList"
			:fixed="true" :auto="false">
			<cell>
				<view :style="'margin-top:'+ navigationBarHeight">
					<view class="card" v-for="item in communtyList" @click="enterDetail(item)">
						<view class="user-info">
							<view class="c-left">
								<!-- <image class="userImg"
									:src="item.userimages||'https://dnsverify.pfmoto.com/appstatic/my/my_icon_avatar_unlogin.png'"
									mode="aspectFit">
								</image> -->

								<image @click.stop="enterPersionCenter($event,item)"
									@touchmove.stop.prevent="handletouchmove"
									@touchstart.stop.prevent="handletouchstart($event,item)"
									@touchend.stop.prevent="handletouchend($event,item)" class="userImg"
									@error="imgerror($event, inedx,'head')"
									:src="item.userimages||'https://dnsverify.pfmoto.com/appstatic/my/my_icon_avatar_unlogin.png'"
									mode="aspectFit"></image>

								<view class="user-name">
									<view class="user-name-view" @click.stop="enterPersionCenter($event,item)">
										<view class="user_name_text" v-if="item.wechatName==''||item.wechatName==null">
											<text class="user_name_text" v-if="item.phone==null||item.phone==undefined">
												已注销用户
											</text>
											<text class="user_name_text" v-else>
												{{item.phone.substr(0, 3) + '*****' + item.phone.substr(8)}}
											</text>
										</view>
										<text class="user_name_text" v-else>{{item.wechatName}}</text>
										<!-- 六期徽章 -->
										<image v-if="item.isUseBadge&&item.isUseBadge==0&&item.badgeImg"
											class="badge_image" :src="item.badgeImg"></image>
										<image v-else class="badge_image" src="https://dnsverify.pfmoto.com/appstatic/my/badge_2.png"
											style="visibility: hidden;"></image>
									</view>


									<!-- 六期认证 -->
									<view class="user-name-view">
										<view class='renzheng'
											v-if="item.officialTalentName!=undefined&&item.officialTalentName!=null&&item.officialTalentName!=''">
											<image class="icon-ok"
												src="https://dnsverify.pfmoto.com/appstatic/community/ok.png">
											</image>
											<!-- 认证用户 -->
											<text class="user-tips">{{item.officialTalentName}}</text>
										</view>
										<block v-else-if="item.isUseExpert==0">
											<image class="expertCertification_image"
												src="@appstatic/my/expert_chuangzuo_2.png"
												v-if="item.expertName=='创作达人'">
											</image>
											<image class="expertCertification_image"
												src="@appstatic/my/expert_daihuo_2.png"
												v-else-if="item.expertName=='带货达人'">
											</image>
											<image class="expertCertification_image"
												src="@appstatic/my/expert_zhishi_2.png"
												v-else-if="item.expertName=='知识达人'">
											</image>
											<image class="expertCertification_image"
												src="@appstatic/my/expert_gongchuang_2.png"
												v-else-if="item.expertName=='共创达人'">
											</image>
											<image class="expertCertification_image"
												src="@appstatic/my/expert_qixing_2.png"
												v-else-if="item.expertName=='骑行达人'">
											</image>
										</block>


									</view>
								</view>
							</view>
							<view v-if="item.authorId!= loginId">

								<text :class="item.isFocus==1?'gz active':'gz'"
									@click.stop="focusCommunity(item)">{{!item.isFocus?"关注":"已关注"}}</text>
							</view>
						</view>
						<view class="content_title">
							<text class="content_title">{{item.title}}</text>
						</view>
						<view class="askType">
							<text v-for="v in item.askTypeList">{{v.name}}</text>
						</view>


						<!-- <view>
							<image class="img_show" src="https://dnsverify.pfmoto.com/appstatic/community/banner.png" mode="aspectFill"></image>
						</view> -->
						<view class="submany">
							<!-- <rich-text @itemclick="preViewRich" class="detail_" :nodes="item.content"></rich-text> -->
							<u-parse :tagStyle="style" class="detail_" :content="item.content"></u-parse>
						</view>
						<view class="user-action">
							<text>{{item.createTime | timeFrom}}</text>
							<view class="action-wraper">
								<image style="width: 29rpx;height: 24rpx;"
									src="https://dnsverify.pfmoto.com/appstatic/community/ac-3.png" mode="aspectFill">
								</image>
								<text>{{item.viewsNum||'0'}}</text>
								<image style="width: 30rpx;height: 28rpx;" @click.stop="updateAskthumbs(item)"
									v-if="item.isThumbs"
									src="https://dnsverify.pfmoto.com/appstatic/community/ac-1-off.png"
									mode="aspectFill">
								</image>
								<image style="width: 30rpx;height: 28rpx;" @click.stop="updateAskthumbs(item)" v-else
									src="https://dnsverify.pfmoto.com/appstatic/community/ac-1.png" mode="aspectFill">
								</image>

								<text @click.stop="updateAskthumbs(item)">{{item.thumbsNum||'0'}}</text>
								<image style="width: 28rpx;height: 26rpx;" @click.stop="giveAnswer()"
									src="https://dnsverify.pfmoto.com/appstatic/community/ac-2.png" mode="aspectFill">
								</image>
								<text @click.stop="giveAnswer()">{{item.commentNum||'0'}}</text>
							</view>
						</view>
					</view>
				</view>

				<view class='pop-con'>
					<view class='hot-com' v-if="answerList.length">
						<text class='com-title'>最佳回答</text>
						<view class='com-list'>
							<view v-for="(item,index) in answerList" :key="index">
								<view class='l-first' v-if="item.isBestAnswer">
									<image class="header-img" mode='aspectFit' @error="imgerror($event, 0,'hot')"
										:src="item.userimages||'https://dnsverify.pfmoto.com/appstatic/my/my_icon_avatar_unlogin.png'">
									</image>
									<view class='list-con'>
										<view class='list-name' v-if="item.wechatName==''||item.wechatName==null">
											<view v-if="item.phone==null||item.phone==undefined">
												已注销用户
											</view>
											<view v-else>
												{{item.phone.substr(0, 3) + '*****' + item.phone.substr(8)}}
											</view>
										</view>
										<view class='list-name' v-else>{{item.wechatName}}</view>
										<view class='list-content'>
											<text class="answer_list">{{item.content}}</text>
										</view>
										<view class="checkDetail" @click="checkDetail(item)"
											v-if="item.content.length>80">
											查看详情
										</view>
										<view class='list-num'>
											<text>{{item.createTime | timeFrom}}</text>

										</view>
									</view>
									<view class='like-box' @click="updateAnswerthumbs(item)">
										<image class='like-img' v-if="item.isThumbs"
											src="https://dnsverify.pfmoto.com/appstatic/community/ac-1-off.png"
											mode="aspectFill">
										</image>
										<image class='like-img' v-else
											src="https://dnsverify.pfmoto.com/appstatic/community/ac-1.png"
											mode="aspectFill">
										</image>
										<view class='like-num'>{{item.thumbsNum||0}}</view>
									</view>
								</view>
							</view>
						</view>
					</view>

					<view class='new-com' v-if="answerList.length">
						<view>
							<view class='com-title'>最新回答</view>
							<view class='com-list' v-for="(item,index) in answerList" :key="index">
								<view class='l-first'>
									<image class="header-img" mode='aspectFit' @error="imgerror($event, index,'new')"
										:src="item.userimages||'https://dnsverify.pfmoto.com/appstatic/my/my_icon_avatar_unlogin.png'">
									</image>
									<view class='list-con'>

										<!-- 	<view class='list-name'>{{item.userName}}</view> -->

										<view class='list-name' v-if="item.wechatName==''|| item.wechatName == null  ">
											<view v-if="item.phone==null||item.phone==undefined">
												已注销用户
											</view>
											<view v-else>
												{{item.phone.substr(0, 3) + '*****' + item.phone.substr(8)}}
											</view>
										</view>
										<view class='list-name' v-else>{{item.wechatName}}</view>
										<view class='list-content'>
											<text class="answer_list">{{item.content}}</text>
										</view>
										<view class='list-num'>
											<text>{{item.createTime | timeFrom}}</text>
										</view>
										<view class="checkDetail" @click="checkDetail(item)"
											v-if="item.content.length>80">
											查看详情
										</view>
									</view>
									<view class='like-box' @click="updateAnswerthumbs(item)">
										<image class='like-img' v-if="item.isThumbs ==1"
											src="https://dnsverify.pfmoto.com/appstatic/community/ac-1-off.png"
											mode="aspectFill">
										</image>
										<image class='like-img' v-else
											src="https://dnsverify.pfmoto.com/appstatic/community/ac-1.png"
											mode="aspectFill">
										</image>
										<view class='like-num'>{{item.thumbsNum||0}}</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
				<!-- 底部 -->
				<view slot="bottom">
					<!-- 评论输入框 -->
					<u-popup :show="show">
						<view class="popup">
							<view class="action-wraper">
								<text style="visibility: hidden;">确定</text>
								<text>分享到</text>
								<image @click="closePopup" src="https://dnsverify.pfmoto.com/appstatic/community/x.png"
									mode="">
								</image>
							</view>
							<view class="share-wraper">
								<view class="item" @click="shareType(1)">
									<image src="https://dnsverify.pfmoto.com/appstatic/community/share-1.png" mode="">
									</image>
									<text>微信</text>
								</view>
								<view class="item" @click="shareType(2)">
									<image src="https://dnsverify.pfmoto.com/appstatic/community/share-2.png" mode="">
									</image>
									<text>朋友圈</text>
								</view>
								<view class="item" @click="shareType(3)">
									<image src="https://dnsverify.pfmoto.com/appstatic/community/share-3.png" mode="">
									</image>
									<text>微博</text>
								</view>
							</view>
						</view>
					</u-popup>
					<showMoreView :isShowMore="isShowMore" @shareAction="shareAction" @deleteAction="deleteAction">
					</showMoreView>
					<clxDialog :isShow='showDelete' @dialogConfirm='dialogConfirm' @dialogCancel='dialogCancel'
						:title="title">
					</clxDialog>
				</view>
			</cell>

		</z-paging>
		<view v-show="showAnwser" class="anser_btn" @click="giveAnswer">
			我要回答
		</view>

	</view>

</template>
<script>
	// pages/sns/sns_detail_sns/sns_detail_sns.js
	import card from '../../../../pages/community/component/card/card'
	import showMoreView from '@/components/showMoreView';
	const app = getApp();
	const util = require("@utils/util.js");
	const network = require("@manager/network-manager.js");
	const dialog = require("@utils/dialog.js");
	import UploadView from '@components/UploadView/UploadView.vue'
	import titlebara from '@/components/titlebar/titlebar'
	import clxDialog from "@/components/clx-dialog/clx-dialog";
	import InputPanel from '@/components/inputPanel/inputPanel.vue'
	const dateForCalendar = require("@utils/dateForCalendar.js");
	export default {
		data() {
			return {
				showAnwser: true,
				focusFlag: false,
				loginId: app.getUserId(),
				flag: false,
				text: '问答',
				isShowMore: false,
				title: '确认删除该条数据?',
				showDelete: false,
				bestAnswerList: [],
				answerList: [],
				show: false,
				detail: {},
				isOk: false,
				swiperCurrent: 0,
				newAnswerList: [],
				communtyList: [],
				myComment: '',
				comment: '',
				commentInfo: {},
				commentType: 0,
				placeholder: "说点什么",
				uuid: '',
				currentUserPhone: '',
				navigationBarHeight: app.globalData.statusBarHeight + 44 + 'px',
				total: 0,
				userInfo: app.globalData.userInfo || {
					phone: ''
				},
				thumbFlag: false,
				style: {
					// 字符串的形式
					p: 'width:100%;word-break:break-all',
					span: 'width:100%;word-break:break-all'
				},
				touchFlag: false,
			};
		},

		components: {
			clxDialog,
			titlebara,
			UploadView,
			card,
			showMoreView,
			InputPanel
		},
		props: {},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			debugger
			if (options && options.id) {
				this.loadDetail(options.id);
				this.uuid = options.id
			}
			uni.getSystemInfo({
				success: function(res) {
					console.log(res, 'getSystemInfo');
					var navigationBarHeight = res.statusBarHeight + 44 + 'px'; //px
				}
			})
			//更新已读
			if (options && options.id && (options.from == "message" || options.from == "notice") && options.myId) {
				this.update2Read(options.id, options.myId, options.from);
			}
		},

		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {
			this.loginId = app.getUserId()
			// this.URL_ACTIVITY_ADDANSWER()
		},

		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},

		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},

		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh: function() {
			this.loadData(true);
		},

		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {},


		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage(res) { //发送给朋友
			return {}
		},
		onShareTimeline(res) { //分享到朋友圈
			return {}
		},

		methods: {
			enterPersionCenter(e, item) {
				// #ifdef APP-NVUE
				e.stopPropagation()
				// #endif
				if (util.isLogin(getApp())) {
					uni.navigateTo({
						url: '/module_my/pages/personalCenter/personalCenter?item=' + JSON.stringify(item)
					})
				} else {
					util.jumpLogin()
				}

			},
			closePopup() {
				this.show = false
				this.showAnwser = true
			},
			refresherTouchend() {
				this.bestAnswerList = []
				this.newAnswerList = []
			},

			//回答点赞更新
			updateAnswerthumbs: function(item) {

				if (util.isLogin(getApp())) {
					if (this.thumbFlag) {
						return
					}
					var that = this;
					var uri = app.globalData.config.interfaces.URL_ACTIVITY_UPDANSWERTHUMBS;
					var thumbsFlag
					item.isThumbs == 0 ? thumbsFlag = 1 : thumbsFlag = 0
					var params = {
						"id": item.uuid,
						"loginId": app.getUserId(),
						"isfrom": 4,
						"thumbsFlag": thumbsFlag
					};
					network.post(uri, params, 'form').then(res => {
						//debugger
						if (res.code == 200) {

							item.thumbsNum = item.thumbsNum + (!item.isThumbs ? 1 : -1);
							item.isThumbs = !item.isThumbs;

						} else {
							uni.showToast({
								title: res.message,
								duration: 3000,
								icon: 'none'
							})
						}

					}).catch(res => {
						uni.showToast({
							title: res.errMsg,
							duration: 3000,
							icon: 'none'
						})
						console.error(res);
					});
				} else {
					util.jumpLogin()
				}
			},
			checkDetail(val) {
				uni.navigateTo({
					url: '/module_community/pages/questionAndAnswer/answerDetail/answerDetail?content=' + val
						.content
				})
			},
			giveAnswer() {

				if (util.isLogin(getApp())) {
					uni.navigateTo({
						url: '/module_community/pages/questionAndAnswer/giveAnswer/giveAnswer?id=' + this.uuid
					})
				} else {
					util.jumpLogin()
				}

			},
			//问题点赞更新
			updateAskthumbs: function(item) {


				if (util.isLogin(getApp())) {
					if (this.thumbFlag) {
						return
					}
					var that = this;
					that.thumbFlag = true
					var uri = app.globalData.config.interfaces.URL_ACTIVITY_UPDATEASKTHUMBS;
					var thumbsFlag
					this.communtyList[0].isThumbs == 0 ? thumbsFlag = 1 : thumbsFlag = 0
					var params = {
						"id": item.id,
						"loginId": app.getUserId(),
						"isfrom": 4,
						"thumbsFlag": thumbsFlag
					};
					network.post(uri, params, 'form').then(res => {
						//debugger
						if (res.code == 200) {
							item.thumbsNum = item.thumbsNum + (!item.isThumbs ? 1 : -1);
							item.isThumbs = !item.isThumbs;


						} else {
							uni.showToast({
								title: res.message,
								duration: 3000,
								icon: 'none'
							})
						}
						that.thumbFlag = false

					}).catch(res => {
						uni.showToast({
							title: res.errMsg,
							duration: 3000,
							icon: 'none'
						})
						that.thumbFlag = false
					});
				} else {
					util.jumpLogin()
				}
			},
			checkDetail(val) {
				uni.navigateTo({
					url: '/module_community/pages/questionAndAnswer/answerDetail/answerDetail?content=' + val
						.content
				})
			},




			//更新已读
			update2Read: function(id, myId, from) {
				//debugger
				var that = this;
				var uri = app.globalData.config.interfaces.URL_SYS_SENDMSG_UPDATE_LEVCMSGUSERREADY;
				var params = {
					// "id": id,
					"id": myId,
					"isType": 2
				};
				network.post(uri, params, 'json').then(res => {
					//debugger
					if (res.code == 200) {
						console.log("已读", JSON.stringify(res));
						if (from == 'message') {
							//回调上一个页面
							let pages = getCurrentPages();
							if (pages.length == 3) {
								let prePage = pages[pages.length - 2];
								let preprePage = pages[pages.length - 3]

								// prePage.refresh(myId);
								// preprePage.refresh();
								// #ifdef H5
								prePage.refresh(myId);
								preprePage.refresh();
								// #endif
								// #ifdef APP-PLUS
								prePage.$vm.refresh(myId);
								preprePage.$vm.refresh();
								// #endif
							}
						} else {
							let pages = getCurrentPages();
							let prePage = pages[pages.length - 2];
							// #ifdef H5
							prePage.refresh(myId);
							// #endif
							// #ifdef APP-PLUS
							prePage.$vm.refresh(myId);
							// #endif
						}
						util.syncBadge(getApp())
					} else {
						uni.showToast({
							title: res.message,
							duration: 3000,
							icon: 'none'
						})
					}

				}).catch(res => {
					uni.showToast({
						title: res.errMsg,
						duration: 3000,
						icon: 'none'
					})
					console.error(res);
				});
			},
			showMore() {
				this.isShowMore = !this.isShowMore;

			},
			shareType(type) {

				var that = this
				var url = "https://pfmotortest.hb4oss.xstore.ctyun.cn/appstatic/community/share.jpg";
				if (this.communtyList.imgList && this.communtyList.imgList.length > 0) {
					url = this.communtyList.imgList[0]+"?x-amz-process=image/resize,w_500";
				}
				if (type == 1) {
					uni.share({
						provider: 'weixin', // 分享服务提供商（即weixin|qq|sinaweibo）
						scene: "WXSceneSession", //分享到聊天界面
						type: 5, //分享形式 5:小程序
						imageUrl: that.detail.cover_ || url, //官方规定分享图比例是5：4,其它尺寸可能显示不全。
						title: that.detail.title,
						miniProgram: {
							id: 'gh_c784b84e778d', //微信小程序原始id
							path: 'module_community/pages/questionAndAnswer/detail/detail?id=' + this.communtyList[
								0].id,
							type: 0, //微信小程序版本类型，可取值： 0-正式版； 1-测试版； 2-体验版。 默认值为0。
							webUrl: 'https://www.pfmoto.com/app' //兼容低版本的网页链接
						},
						success: ret => {
							console.log(JSON.stringify(ret));
						},
						fail: ret => {
							console.log("fail" + JSON.stringify(ret));
						}
					});

				} else if (type == 2) {

					uni.share({
						provider: "weixin",
						scene: "WXSceneTimeline",
						type: 2,
						href: "https://www.pfmoto.com/app",
						title: that.detail.title,

						imageUrl: that.detail.cover_ || url,
						success: function(res) {
							console.log("success:" + JSON.stringify(res));
						},
						fail: function(err) {
							console.log("fail:" + JSON.stringify(err));
						}
					});
				} else if (type == 3) {
					uni.share({
						provider: "sinaweibo",
						title: that.detail.title,
						summary: that.detail.content.replace(/<\/?.+?>/g, "").replace(/ /g, ""),
						imageUrl: '', //官方规定分享图比例是5：4,其它尺寸可能显示不全。
						href: 'https://www.pfmoto.com/app',
						type: 0,
						success: function(res) {
							console.log("success:" + JSON.stringify(res));

						},
						fail: function(err) {
							console.log("fail:" + JSON.stringify(err));

						}
					});

				}
				this.show = false
				this.showAnwser = true
			},
			//展示删除弹窗
			deleteAction: function() {
				if (util.isLogin(getApp())) {
					if (this.currentUserPhone == app.globalData.userInfo.phone) {
						this.showDelete = true
					} else {
						uni.showToast({
							title: '只能删除自己的动态',
							duration: 3000,
							icon: 'none'
						})
					}
					this.isShowMore = false
				} else {
					uni.setStorageSync('momentDetailId', this.uuid)
					util.jumpLogin("momentDetail")
				}


			},
			//删除弹窗-确定按钮
			dialogConfirm(e) {
				this.showDelete = false
				this.onConfirmDelete()
			},
			enterCommentDetail(row) {
				uni.navigateTo({
					url: '/module_community/pages/moments/list/list?from=moment&row=' + JSON.stringify(row)
				})
			},
			//删除弹窗-取消按钮
			dialogCancel() {
				this.showDelete = false
				this.delItem = ""
			},
			//确认删除方法
			onConfirmDelete() {
				var that = this;
				var uri = app.globalData.config.interfaces.URL_ASK_UPDATE;
				var params = {
					id: this.uuid,
					delFlag: true
				};
				network.post(uri, params, 'json').then(res => {
					uni.stopPullDownRefresh();
					if (res.code == 200) {
						uni.showToast({
							title: '删除成功',
							duration: 3000,
							icon: 'none'
						})
						uni.navigateBack({
							delta: 1
						});
					} else {
						uni.showToast({
							title: res.message,
							duration: 3000,
							icon: 'none'
						})
					}
				}).catch(res => {
					console.error(res, 'err')

					uni.showToast({
						title: res.errMsg,
						duration: 3000,
						icon: 'none'
					})
					console.error(res);

				});
			},
			shareAction(type) {
				if (util.isLogin(getApp())) {
					this.isShowMore = false
					this.show = true
					// uni.showToast({
					// 	title: '待开放平台权限申请',
					// 	duration: 3000,
					// 	icon: 'none'
					// })
					this.showAnwser = false
				} else {
					uni.setStorageSync('momentDetailId', this.uuid)
					util.jumpLogin("momentDetail")
				}
			},


			swiperChange: function(e) {
				this.setData({
					swiperCurrent: e.detail.current
				});
			},
			/**
			 * 用户点击右上角分享
			 */
			onNavigationBarButtonTap: function(e) {
				// this.show = true
				// this.shareAction()
				this.showMore()
			},


			imgMatch(str) {
				var data = '';
				str.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/, function(match, capture) {
					data = capture;
				});
				return data
			},
			loadDetail: function(id) {
				var that = this;

				var uri = app.globalData.config.interfaces.URL_ACTIVITY_GETASKINFO;
				var params = {
					"id": id,
					"loginId": app.getUserId() || 0

				};
				network.get(uri, params, 'form').then(res => {
					if (res.code == 200) {
						that.detail = res.data

						that.detail.cover_ = that.imgMatch(that.detail.content)
						that.currentUserPhone = res.data.phone
						that.communtyList = []
						that.communtyList.push(res.data)

						that.total = res.data.commentNum

						that.loadData(true);
						that.$nextTick(() => {
							that.$refs.paging.reload();
						})
					} else {
						uni.showToast({
							title: res.message,
							duration: 3000,
							icon: 'none'
						})
					}
				}).catch(res => {
					uni.showToast({
						title: res.errMsg,
						duration: 3000,
						icon: 'none'
					})
					console.error(res);
				});
			},
			/**
			 * 预览图片  
			 */
			previewImage: function(img) {

				//#ifndef MP-WEIXIN
				wx.previewImage({
					current: 0,
					urls: [img],
				});
				//#endif
				uni.previewImage({
					current: 0,
					urls: [img]
				});
			},
			loadData: function(isRefresh) {


				// this.loadnewAnswerList()
				// this.loadnewAnswerList(isRefresh);
			},
			selectCommpent(item, type) {
				// this.commentType = type
				// this.commentInfo = item
				// var name = item.wechatName || item.phone
				// this.placeholder = "回复@" + name + ':'
			},
			focusCommunity(item) {


				var that = this
				if (util.isLogin(getApp())) {
					if (this.focusFlag) {
						return
					}
					this.focusFlag = true
					if (item.isFocus == 1) {
						var params = {
							"fanId": app.getUserId(),
							"authorId": item.authorId,
						};
						var uri = app.globalData.config.interfaces.URI_COMMUNITY_FOCUS_CANCEL;
						network.post(uri, params, 'json').then(res => {
							if (res.code == 200) {

								item.isFocus = 0



							} else {
								uni.showToast({
									title: res.message,
									duration: 3000,
									icon: 'none'
								})
							}
							that.focusFlag = false
						}).catch(res => {
							that.focusFlag = false
							setTimeout(() => {
								uni.showToast({
									title: res.errMsg,
									duration: 3000,
									icon: 'none'
								})
							}, 500)
							console.error(res);
						});
					} else {
						var params = {
							"brankId": item.id,
							"fanId": app.getUserId(),
							"authorId": item.authorId,
							"isfrom": 4,
							"isSource": item.subType

						};

						var uri = app.globalData.config.interfaces.URI_COMMUNITY_FOCUS;
						network.post(uri, params, 'json').then(res => {
							if (res.code == 200) {


								item.isFocus = 1



							} else {
								setTimeout(() => {
									uni.showToast({
										title: res.message,
										duration: 3000,
										icon: 'none'
									})
								}, 500);
							}
							that.focusFlag = false
						}).catch(res => {

							that.focusFlag = false
							setTimeout(() => {
								uni.showToast({
									title: res.errMsg,
									duration: 3000,
									icon: 'none'
								})
							}, 500);
							console.error(res);
						});
					}

				} else {
					util.jumpLogin(this.from)
				}
			},

			commentTouched() {

				if (util.isLogin(getApp())) {
					if (this.flag) {
						return
					}

					var that = this
					console.log("最多输入100字" + that.comment.length)
					if (that.comment.length > 100) {
						uni.showToast({
							title: '最多输入100字',
							duration: 3000,
							icon: 'none'
						})
						return
					}
					if (that.comment.length == 0) {
						uni.showToast({
							title: '请输入评论内容',
							duration: 3000,
							icon: 'none'
						})
						return
					}
					var uri = app.globalData.config.interfaces.ULR_COMMUNTITY_COMMENT;
					var id = that.detail.id
					var commentType = 0

					if (that.commentInfo.uuid) {
						console.log()
						id = that.commentInfo.uuid
						commentType = that.commentType

					}
					var pictureurl = ""
					if (that.fileList.length > 0 && (that.fileList[0].url != null && that.fileList[0].url != undefined)) {
						pictureurl = that.fileList[0].url
					}

					var params = {
						"communityId": that.detail.id,
						"pid": id,
						"commentType": commentType,
						"authorId": app.getUserId(),
						"isfrom": 2,
						"content": that.comment,
						"picture": pictureurl
					};
					this.flag = true
					network.post(uri, params, 'json').then(res => {
						if (res.code == 200) {

							// this.loadnewAnswerList(true)
							// this.loadHotCommenyList()
							that.comment = ""
							that.fileList = []
							var add = {
								type: 0,
								mediaType: 'add',
								url: '',
								path: '',
								uuid: util.createUidKey()
							}
							that.fileList.push(add)

							that.placeholder = "说点什么";
							that.loadData(true);

						} else {

							uni.showToast({
								title: res.message,
								duration: 3000,
								icon: 'none'
							})
						}
						that.flag = false
					}).catch(res => {

						that.flag = false
					});
				} else {
					uni.setStorageSync('momentDetailId', this.uuid)
					util.jumpLogin("momentDetail")
				}

			},

			loadnewAnswerList(pageNo, pageSize) {

				var that = this;
				var uri = app.globalData.config.interfaces.URL_ACTIVITY_GETANSWERLIST;
				var params = {
					"pageNum": pageNo,
					"pageSize": pageSize,
					"askId": this.detail.id,
					"loginId": app.getUserId() || ""
				};
				network.get(uri, params, 'form').then(res => {
					if (res.code == 200) {

						res.data.list.map(item => {
							if (item.isBestAnswer) {
								that.bestAnswerList.push(item)
							} else {
								that.newAnswerList.push(item)
							}
						})

						that.answerList = res.data.list
						that.$refs.paging.complete(res.data.list);
					} else {
						uni.showToast({
							title: res.message,
							duration: 3000,
							icon: 'none'
						})
						that.$refs.paging.complete(false);
					}
				}).catch(res => {
					uni.stopPullDownRefresh();
					uni.showToast({
						title: res.errMsg,
						duration: 3000,
						icon: 'none'
					})

				});
			},
			//点赞社区动态
			thumbCommuntyTouched: function(item) {

				if (util.isLogin(getApp())) {

					var uri = app.globalData.config.interfaces.URL_COMMUNTIY_THUMB;
					var thumbsFlag
					item.isThumbs == 0 ? thumbsFlag = 1 : thumbsFlag = 0
					var params = {
						"id": item.uuid,
						"loginId": app.getUserId(),
						// "isfrom": 2,
						"isfrom": 1,
						"thumbsFlag": thumbsFlag
					};
					network.post(uri, params, 'form').then(res => {
						if (res.code == 200) {
							item.thumbsNum = item.thumbsNum + (!item.isThumbs ? 1 : -1);
							item.isThumbs = !item.isThumbs;
							if (this.bestAnswerList && this.bestAnswerList[0].uuid == item.uuid) {
								this.bestAnswerList[0].thumbsNum = item.thumbsNum
								this.bestAnswerList[0].isThumbs = !item.isThumbs;
							}
						} else {
							uni.showToast({
								title: res.message,
								duration: 3000,
								icon: 'none'
							})
						}
					}).catch(res => {
						uni.showToast({
							title: res.errMsg,
							duration: 3000,
							icon: 'none'
						})
						console.error(res);
					});
				} else {
					uni.setStorageSync('momentDetailId', this.uuid)
					util.jumpLogin("momentDetail")
				}
			},
			myCommentInput: function(e) {
				this.comment = e.detail.value
				if (this.comment == '' && this.fileList.length == 1) {
					this.isOk = false
				} else {
					this.isOk = true
				}
			},

			close() {
				this.$refs.popup.close()
				this.$emit('openMement', {}, false)
			},
			//图片加载错误默认图
			imgerror: function(e, img_index, type) {
				var that = this
				if (type == 'hot') {
					that.bestAnswerList.userimages =
						"https://dnsverify.pfmoto.com/appstatic/my/my_icon_avatar_unlogin.png"
				} else if (type == 'new') {
					that.newAnswerList[img_index].userimages =
						"https://dnsverify.pfmoto.com/appstatic/my/my_icon_avatar_unlogin.png"
				} else if (type == 'head') {
					that.communtyList[0].userimages =
						"https://dnsverify.pfmoto.com/appstatic/my/my_icon_avatar_unlogin.png"
				}

			},
			uploadPercent() {

			},
			handletouchend(e, item) {
				clearTimeout(this.timeOutEvent); //清除定时器    
				var that = this

				if (!this.touchFlag) {
					that.enterPersionCenter(e, item)
				}
				this.touchFlag = false

				return false;
			},
			handletouchstart(e, item) {
				var that = this
				this.timeOutEvent = setTimeout(() => {
					that.touchFlag = true
					that.longPress(item)

				}, 1000) //这里设置定时器，定义长按1000毫秒触发长按事件，时间可以自己改，  

			},
		}
	};
</script>
<style lang='scss' scoped>
	.expertCertification_image {
		width: 100rpx;
		height: 28rpx;
		margin-left: 6rpx;

	}

	.renzheng {
		display: flex;
		flex-direction: row;
		margin-left: 6rpx;
		margin-top: -6rpx;
		margin-right: 20rpx;
	}

	.icon-ok {
		width: 16px;
		height: 16px;
		margin-right: 4rpx;
	}

	.user-tips {
		font-style: normal;
		font-weight: 500;
		font-size: 20rpx;
		line-height: 28rpx;
		display: flex;
		align-items: center;
		color: #ADB0AE;
	}

	.user-name {
		/* font-style: normal;
		font-weight: 500;
		font-size: 28rpx;
		line-height: 40rpx;
		color: #3d3a3a; 
		background-color: red */
		display: flex;
		align-items: flex-start;
		align-content: center;
		margin-left: 16rpx;
		flex-direction: column;
	}

	.user-name-view {
		display: flex;
		flex-direction: row;
		/* align-items:center; */
	}

	.user_name_text {
		font-size: 28rpx;
		/* width: 450rpx; */
		max-width: 400rpx;
		padding-left: 10rpx;
		margin-top: 8rpx;
		height: 40rpx;
		overflow: hidden;
		/* #ifndef APP-PLUS-NVUE */
		-webkit-line-clamp: 1;
		display: block;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
		text-align: justify;
		/* #endif */
		/* #ifdef APP-PLUS-NVUE */
		overflow: hidden;
		text-overflow: ellipsis;

		lines: 1;
		/* #endif */
	}




	.badge_image {
		width: 60rpx;
		height: 60rpx;
		margin-left: 10rpx;
		bottom: 8rpx;
	}








	.more-comment {

		font-size: 24rpx;
		color: #ea5404;
		margin-top: 20rpx;
	}

	.titlebar {
		top: 0;

	}

	.titleText {
		color: #3D3A3A;
		text-align: center;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-weight: 600;
		font-size: 16px;
		align-items: center;
		display: flex;
		position: absolute;
		top: calc(50% - 10px);
		left: calc((100% - 40px)/2);

	}

	.showMore {
		width: 24px;
		height: 24px;
		position: absolute;
		left: 44px;
		top: calc(50% - 12px);
		/*#ifdef APP-PLUS||H5*/
		left: calc(100% - 36px);
		/*#endif*/
	}

	.submany {
		width: 100%;

		margin-top: 20rpx;
	}

	.detail_ p {
		width: 100%;
		word-break: break-all !important;
	}

	.uploadImg {
		margin-top: 40rpx;

		.videoClass {
			width: 100%;

			#myVideo {
				width: 100%;
			}
		}

		.imageList {
			margin: 6rpx 6rpx 0 0;
			display: inline-block;
			position: relative;

			.image {
				width: 216rpx;
				height: 216rpx;
				display: inline-block;
				border-radius: 20rpx;
			}

			.delImg {
				position: absolute;
				right: 8rpx;
				top: 8rpx;
				width: 40rpx;
				height: 40rpx;
				z-index: 2;
			}
		}

		.onlyImageList {
			.onlyImage {
				width: 100%;
				display: inline-block;
			}
		}
	}

	/deep/.z-paging-content {
		background-color: #ffffff;
	}

	.uploadBtn {
		width: 216rpx;
		height: 216rpx;
		border-radius: 20rpx;
		display: inline-block;
	}

	.active {
		color: #ea5454 !important;
	}

	.topic-detail {
		overflow-y: scroll;
	}

	.videoView {
		width: 672rpx;
		height: 522rpx;
		border-radius: 20rpx;
		display: inline-block;
		margin-bottom: 100rpx;
	}

	page {
		background: #f7f8fa;
		overflow-y: auto;
	}

	.upload-img image {
		width: 40rpx;
		height: 36rpx;
		margin-right: 20rpx;
		margin-top: 8rpx;
	}

	.play {
		width: 100%;
		height: 100%;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		z-index: 1;
	}

	.share-wraper {
		display: flex;

		justify-content: space-around;
		padding: 80rpx;
	}

	.share-wraper .item {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.share-wraper .item image {
		width: 50rpx;
		height: 50rpx;
		margin-bottom: 20rpx;
	}

	.share-wraper .item text {
		font-weight: 400;
		font-size: 24rpx;
		line-height: 34rpx;
		text-align: center;
		letter-spacing: -0.24px;
		color: #3D3A3A;
	}

	.play image {
		display: block;
		transform: translate(-50%, -50%);
		position: absolute;
		left: 50%;
		top: 50%;
	}

	.action-wraper {
		display: flex;
		justify-content: space-between;
		padding: 30rpx 20rpx;
		padding-right: 0;
	}

	.action-wraper text {
		font-size: 32rpx;

		color: #3d3a3a;
	}

	.action-wraper image {
		width: 48rpx;
		height: 48rpx;
	}

	.container {
		background-color: #ffffff;
		height: calc(100vh - 88rpx);
		justify-content: flex-start;

		display: flex;
		flex-direction: column;
	}

	.contentView {
		/*#ifdef MP-WEIXIN*/
		/* margin-top: 88px; */
		/*#endif*/
		/*#ifdef APP-PLUS||H5*/
		/* margin-top: 44px; */
		/*#endif*/
		overflow-y: scroll;
	}

	.tag {
		border-radius: 33px;
		border: 1px solid #bdbdbd;
		background-color: #FFFFFF;
		font-size: 10px;
		color: #bdbdbd;
		display: inline-block;
		padding: 2px 15px;
		margin-bottom: 10px;
		margin-right: 10px;
		margin-top: 30rpx;
	}

	.comm_top {
		display: flex;
		align-items: center;
		padding-bottom: 30rpx;
		padding-top: 14rpx;
	}

	.answer_list {
		background-color: #ffffff;
		border: none;
		max-height: 120rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		line-clamp: 3;
		-webkit-box-orient: vertical;
		text-align: justify;
	}

	.comm_top image {
		width: 80rpx;
		height: 80rpx;
		border-radius: 80rpx;
		margin-right: 26rpx;
		flex-shrink: 0;
	}

	.comm_top .tis view:first-of-type {
		font-size: 32rpx;
		line-height: 38rpx;
		font-weight: 400;
	}

	.comm_top .tis view:last-of-type {
		font-size: 20rpx;
		line-height: 24rpx;
		color: #bdbdbd;
		padding-top: 10rpx;
	}

	.comm_pic {
		position: relative;
	}

	.comm_pic image {
		width: 215rpx;
		height: 168rpx;
		margin-bottom: 12rpx;
		/* margin-right: 12rpx; */
	}

	.comm_pic image:nth-child(3n + 0) {
		margin-right: 0;
	}

	.comm_tips {
		padding-top: 48rpx;
	}

	.comm_tips text {
		min-width: 132rpx;
		height: 48rpx;
		/* background: #acb8c6; */
		border-radius: 8rpx;
		color: #BDBDBD;
		font-size: 28rpx;
		line-height: 48rpx;
		text-align: center;
		display: inline-block;
		margin-right: 15rpx;
	}

	.comm_bottom {
		padding-top: 14rpx;
		display: flex;
		font-size: 24rpx;
		color: #bdbdbd;
		justify-content: flex-start;
	}

	.comm_bottom view {
		margin-right: 40rpx;
		display: flex;
		align-items: center;
	}

	.comm_bottom image {
		width: 24rpx;
		height: 24rpx;
		margin-right: 10rpx;
	}

	.checkDetail {
		font-weight: 400;
		font-size: 28rpx;
		line-height: 68rpx;
		color: #EA5404;
	}

	.comm_bottom image:first-of-type {
		width: 28rpx;
		height: 28rpx;
	}

	.comm_bottom image:last-of-type {
		width: 30rpx;
		height: 30rpx;
	}

	.Community_cont {
		padding: 36rpx;
		background: #fff;

	}

	.comm_bottom {
		padding-bottom: 40rpx;
		border-bottom: 1px solid #E0E0E0;
	}

	.tits {
		color: #636363;
		font-size: 28rpx;
		line-height: 160%;
		max-width: 100%;
		text-align: justify;
		word-break: break-word;
	}

	.more {
		padding: 80rpx 0;
		text-align: center;
	}

	.more image {
		width: 270rpx;
		height: 48rpx;
	}

	.pic_one image {
		width: 100%;
		height: 168rpx;
	}

	.Community_cont:last-of-type {
		margin-bottom: 0;
	}

	.pl_list {
		background: #fff;
		padding: 40rpx;
		padding-bottom: 160rpx;
	}

	.pl_list .h1 {
		font-size: 32rpx;
		color: #333333;
		font-weight: 500;
		line-height: 40rpx;
		padding-bottom: 40rpx;
	}

	.anser_btn {
		position: fixed;
		bottom: 60rpx;
		left: 0;
		width: calc(100% - 60rpx);
		height: 84rpx;
		background-color: #EA5404;
		text-align: center;
		color: #ffffff;
		font-size: 32rpx;
		left: 30rpx;
		line-height: 84rpx;
	}

	.pl_cont {
		padding: 0;
		display: flex;
		margin-bottom: 40rpx;
	}

	.tx {
		height: 96rpx;
	}

	.pl_cont .tx image {
		width: 80rpx;
		height: 80rpx;
		border-radius: 100%;
		margin-right: 26rpx;
	}

	.zan {
		width: 24rpx;
		height: 24rpx;
	}

	.pl_cont .news text {
		display: block;
		font-size: 28rpx;
		line-height: 40rpx;
		/* overflow: hidden; */
		/* text-overflow: ellipsis; */
		/* white-space: nowrap; */
		word-break: break-word;
	}

	.askType {
		margin: 20rpx 0;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		border-radius: 4rpx;

	}

	.askType text {
		padding: 4rpx 16rpx;
		background-color: #EA5404;
		font-size: 24rpx;
		margin-right: 20rpx;
		margin-bottom: 20rpx;
		color: #FFFFFF;
	}

	.news {
		width: 432rpx;
	}

	.pl_cont .news text:first-of-type {
		font-size: 28rpx;
		line-height: 40rpx;
		padding-bottom: 10rpx;
		color: #828282;
	}

	.pl_cont .news text:last-of-type {
		font-size: 24rpx;
		line-height: 34rpx;
		color: #bdbdbd;
		padding-top: 10rpx;
	}

	.zs {
		display: flex;
		width: 96rpx;
		height: 96rpx;
		text-align: center;
		flex-wrap: wrap;
		justify-content: flex-end;
	}

	.zs text {
		font-size: 24rpx;
		line-height: 30rpx;
		color: #bdbdbd;
		display: block;
	}

	.wp_zs {
		position: absolute;
		right: 60rpx;
	}

	.wp_zs image {
		width: 24rpx;
		height: 24rpx;
		margin-right: 0;
	}

	.footer {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		display: flex;
		flex-direction: row;
		background-color: #ffffff;
		padding-top: 10px;
		padding-bottom: 10px;

		display: flex;
		padding-right: 23px;
		align-items: center;
	}

	.inputGreybg {
		background-color: #F7F8FA;
		line-height: 68rpx;
		height: 68rpx;
		/* width: 550rpx; */
		position: relative;
		margin: auto;
		border: none;
		border-radius: 4rpx;
		font-size: 32rpx;
		color: #333333;
		width: calc(100% - 190rpx);
		flex-direction: row;
		display: flex;
		align-items: center;

	}

	.dots {
		position: absolute;
		right: 20rpx;
		bottom: 20rpx;
		width: 60rpx;
		height: 30rpx;
		background-color: rgba(0, 0, 0, .6);
		border-radius: 30rpx;
		text-align: center;
		color: #ffffff;
		font-size: 20rpx;
		line-height: 30rpx;
	}

	.banner {
		position: relative;
		margin-bottom: 30rpx;
	}

	.banner image {
		border-radius: 20rpx;
	}

	.myComment {
		color: #BDBDBD;
		font-size: 24rpx;
		margin-left: 20rpx;
		margin-right: 20rpx;
		width: 100%;
	}

	.login-button {

		font-style: normal;
		font-weight: 400;
		font-size: 16px;
		line-height: 22px;
		display: flex;
		align-items: center;


		color: #ADB0AE;
	}

	/* //原生的按钮就是这样难改 */
	button.login-button[plain] {
		border: 0;
		background-color: #333333;
		color: #ffffff;
		font-size: 32rpx;
	}

	.item_party_imageFlex {
		justify-content: space-between;
		display: flex;
		flex-wrap: wrap;
	}

	.item_party_imageFlex:after {
		content: "";
		width: 30%;
		height: 0px;
		visibility: hidden;
	}

	.greybg {
		margin: auto;
		border: none;
		background-color: #F7F8FA;
		border-radius: 20rpx;
		margin-left: 40rpx;
		margin-right: 40rpx;
		padding: 20rpx;
		margin-top: 40rpx;
	}

	.all-footer {
		font-size: 28rpx;
		line-height: 76rpx;
		color: #ADB0AE;
		text-align: center;
		margin-top: 50rpx;
	}

	.vertical {
		display: flex;
		flex-direction: column
	}

	.no_commentImage {

		width: 101rpx;
		height: 61rpx;
		margin: 20rpx;
	}

	.no_commentText {
		font-size: 24rpx;
		color: #C4C4C4;

		margin-bottom: 20rpx;
	}

	/deep/.zp-paging-container {
		padding-bottom: 120rpx;
	}

	/deep/.z-paging-content-fixed {
		padding: 30rpx;
	}

	.comments-pop {
		width: 100vw;
		color: #3D3A3A;
		font-size: 28rpx;
		background: #ffffff;

		.pop-con {
			width: 100%;
			position: relative;
			box-sizing: border-box;
			padding: 0rpx 32rpx 60rpx;
			background: #fff;
			border-radius: 4px 4px 0px 0px;
			margin-top: 30rpx;



			.con-title {
				width: 100%;
				box-sizing: border-box;
				padding: 0 32rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				font-weight: 600;
				font-size: 32rpx;
				height: 112rpx;

				line-height: 112rpx;
				position: absolute;
				top: 0;
				left: 0;
				background-color: #fff;
				opacity: 1;
				z-index: 99;

				image {
					width: 48rpx;
					height: 48rpx;
				}
			}

			.hot-com,
			.new-com {
				.com-title {
					margin: 32rpx 0 16rpx;
					font-family: 'PingFang SC';
					font-style: normal;
					font-weight: 600;
					font-size: 28rpx;
					line-height: 40rpx;
					/* identical to box height */

					padding-bottom: 20rpx;

					color: #000000;
				}

				.com-list {
					.l-first {
						display: flex;
						justify-content: space-between;
						padding-top: 32rpx;
						flex-direction: row;

						.header-img {
							width: 64rpx;
							height: 64rpx;
							border-radius: 50%;
						}

						.list-con {
							flex: 1;
							padding-left: 32rpx;
							line-height: 40rpx;
							margin-top: 6rpx;

							.list-name {
								font-family: 'PingFang SC';
								font-style: normal;
								font-weight: 500;
								font-size: 28rpx;
								line-height: 40rpx;
								/* identical to box height */



								color: #000000;
							}

							.list-content {
								margin-top: 16rpx;
								font-family: 'PingFang SC';
								font-style: normal;
								font-weight: 500;
								font-size: 28rpx;
								line-height: 40rpx;
								/* identical to box height */

								display: flex;


								/* 力帆-黑 */

								color: #3D3A3A;
								word-break: break-all;

							}

							.list-img {
								width: 200rpx;
								width: 200rpx;
								margin: 20rpx 0 0 0;
							}

							.list-num {
								font-family: 'PingFang SC';
								font-style: normal;
								font-weight: 500;
								font-size: 12px;
								line-height: 17px;
								display: flex;

								color: #ADB0AE;
								margin-top: 10px;
								padding-left: 4rpx;
								justify-content: flex-start;
							}

							.list-num text {
								margin-right: 10rpx;

							}
						}

						.like-box {
							display: flex;
							flex-direction: row;

							.like-img {
								width: 34rpx;
								height: 34rpx;
								vertical-align: middle;
							}

							.like-num {
								display: inline-block;
								font-size: 24rpx;
								color: #ADB0AE;
								margin-left: 4rpx;
								position: relative;
								top: 0px;
							}
						}

					}

					.sub {
						padding-left: 96rpx;
					}
				}
			}



			.input-box {
				width: 100%;
				height: 108rpx;
				display: flex;
				align-items: center;
				position: fixed;
				bottom: 100rpx;
				left: 0;
				background-color: #fff;
				z-index: 99;

				input {
					flex: 1;
					background: #EDEDED;
					border-radius: 4rpx;
					height: 68rpx;
					line-height: 68rpx;
					margin-left: 32rpx;
					padding-left: 32rpx;
				}

				image {
					width: 48rpx;
					height: 48rpx;
					margin: 0 32rpx;
				}

				.send {
					font-size: 32rpx;
					line-height: 44rpx;
					color: #ADB0AE;
					margin-right: 32rpx;
				}
			}
		}
	}

	.card {
		margin-top: 40rpx;
		border-bottom: 1px solid #EDEDED;

	}

	.user-action {
		display: flex;
		justify-content: space-between;
		flex-direction: row;
		/* margin-top: 20px; */
		align-items: center;
	}

	.detail {
		justify-content: flex-start;
		margin-top: 30rpx;
	}

	.action-wraper {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.user-action image {
		width: 32rpx;
		height: 32rpx;
	}

	.user-action text {
		font-size: 24rpx;
		color: #ADB0AE;
		margin-right: 16rpx;

		margin-left: 4rpx;
		position: relative;
		top: 2rpx;
		margin-right: 20rpx;
	}

	.topic {
		display: flex;
		margin-top: 30rpx;
		flex-wrap: wrap;
	}

	.topic image {
		width: 24rpx;
		height: 24rpx;
	}

	.compent {
		width: calc(100% - 40rpx);
		margin: 16rpx auto;

		background-color: #ededed;
		padding: 20rpx;
	}

	.compent-user {
		color: #ADB0AE;
		font-family: 'PingFang SC';
		font-style: normal;
		font-weight: 400;
		font-size: 24rpx;
		line-height: 34rpx;
		padding-right: 6rpx;
	}

	.action-wraper {
		display: flex;
		align-items: center;
	}

	.compent-content {
		font-size: 24rpx;
		font-family: 'PingFang SC';
		font-style: normal;
		font-weight: 400;
		line-height: 34rpx;
		text-align: justify;
		color: #000000;
		word-break: break-all;
	}

	.content_title {
		font-weight: 600;
		font-size: 28rpx;
		line-height: 20px;
		color: #3D3A3A;
		padding-bottom: 10rpx;
		word-break: break-all;
	}

	.user-info {
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-direction: row;
		align-items: center;
		margin-bottom: 40rpx;
	}

	.gz {
		font-family: 'PingFang SC';
		font-style: normal;
		font-weight: 400;
		font-size: 24rpx;
		line-height: 52rpx;
		display: inline-block;
		width: 112rpx;
		height: 50rpx;

		text-align: center;

		border-radius: 4rpx;
		border: 2rpx solid #EA5404;
		color: #EA5404;

	}

	.active {
		border: 2rpx solid #ADB0AE;

		color: #ADB0AE !important;
	}

	.content_submy {
		font-weight: 400;
		font-size: 28rpx;
		line-height: 20px;
		color: #ADB0AE;
		margin-bottom: 20rpx;
	}

	.c-left {
		display: flex;
		flex-direction: row;
	}

	.img_show {
		width: 100%;
	}

	.userImg {
		width: 96rpx;
		height: 96rpx;
		border-radius: 50%;

	}

	.lel-icon {
		width: 42rpx;
		height: 32rpx;
		position: relative;
		top: 4rpx;

		left: 6rpx;
	}
</style>
